<template>
  <work-template @closeSelectedTag="closeSelectedTag" @submitOn="submitOn"
                 :flowId="flowId"
                 v-loading="loading"
                 :butShow="true">
    <div slot="form" class="container-div">
      <!--主订单-->
      <mainOrder v-model="ruleForm"/>
      <!--退保台数-->
      <cancellationNumber v-model="ruleForm" state="write" ref="refCancellationNumber"/>
    </div>
  </work-template>
</template>

<script>
import * as apis from "@/api/deliveryVehicle"
import {commit} from "@/api/deliveryVehicle";

export default {
  name: 'DeliveryVehicleEdit',
  components: {
    //主订单
    mainOrder: () => import('./components/mainOrder.vue'),
    //退保台数
    cancellationNumber: () => import('./components/cancellationNumber.vue'),
  },
  computed: {
    flowId() {
      return this.$route.query.flowId
    }
  },

  data() {
    return {
      ruleForm: {
        returnDepositNum: '',
        returnDeposit: '',
        unpreparedCarDepositInfoList: [],
        orderId: '',
        unpreparedCarId: ''
      },
      tableData: [],
      loading: false
    };
  },
  created() {
    if (this.$route.query.id) {
      this.handleDetails(apis?.queryOrderInfo(this.$route.query.id))
    }
    if (this.$route.query.unpreparedCarId) {
      this.handleDetails(apis?.unpreparedCarDeposit(this.$route.query.unpreparedCarId))
    }
  },
  mounted() {
  },
  methods: {
    async handleDetails(typeApi) {
      this.loading = true
      try {
        let res = await typeApi
        this.ruleForm = res.data
        this.ruleForm.orderId = res.data?.orderId ? res.data?.orderId : this.$route.query?.id || null
        this.ruleForm.unpreparedCarId = this.$route.query?.unpreparedCarId || null
      } catch (e) {
        console.error(e)
      } finally {
        this.loading = false
      }
    },

    async submitOn() {
      let loading
      try {
        await this.$refs.refCancellationNumber.handleEffect()
        loading = this.$loading({
          lock: true,
          text: "保存中",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        });
        let res = await apis.commit(this.ruleForm)
        if (res.code === 200) {
          loading.close()
          this.closeSelectedTag()
        }
      } catch (e) {
        console.error(e)
      } finally {
        loading.close()
      }
    },

    closeSelectedTag() {
      this.$tab.closePage().then(({visitedViews}) => {
        this.$router.push({
          path: "/vehicleOrder/orderManagement/DeliveryVehicleList",
        });
      });
    }
  },
};
</script>

<style lang="scss" scoped>
@import "@/styles/cwgd/container.scss";
</style>


